<!--
 * @Descripttion: 
 * @version: 
 * @Author: kk
 * @Date: 2020-10-23 17:44:42
 * @LastEditors: kk
 * @LastEditTime: 2020-10-24 15:38:31
-->
<!--  -->
<template>
  <div >
    <el-form
      ref="form"
      :model="itemKillInfo"
      label-width="80px"
      class="Center"
    >
    <el-form-item label="活动商品">
        <el-select v-model="itemKillInfo.itemId" placeholder="活动商品" @change="getChoose" >
            <el-option v-for=" item in items" :key="item.id" :label="item.name" :value="item.id" ></el-option>
        </el-select>
    </el-form-item>
    <el-form-item label="秒杀数量">
        <el-input style="width: 60%" v-model="itemKillInfo.total"></el-input>
    </el-form-item>
    
    <el-form-item label="活动时间">
      <el-date-picker
      v-model="itemKillInfo.startTime"
      type="datetime"
      value-format="yyyy-MM-dd HH:mm:ss"
      placeholder="选择日期时间">
    </el-date-picker>
    <el-date-picker
      v-model="itemKillInfo.endTime"
      type="datetime"
      value-format="yyyy-MM-dd HH:mm:ss"
      placeholder="选择日期时间">
    </el-date-picker>
    </el-form-item>

    <el-form-item>
        <el-button
          type="primary"
          @click="onSubmit"
        >添加或更新</el-button>
        <el-button>取消</el-button>
    </el-form-item>
    </el-form>
  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import item from "@/api/item";
import itemKill from "@/api/itemKill"
export default {
  //import引入的组件需要注入到对象中才能使用
  components: {},
  data() {
    return {
      itemKillId: "",
      itemKillInfo: {
          
      },
      items:[]
    };
  },
  //方法集合
  methods: {
    onSubmit() {
      //判断是添加还是更新
      if (!this.itemKillId) {
        this.addItemKill();
      } else {
        this.updateItemKill();
      }
    },
    //添加商品
    addItemKill() {
      console.log(this.itemKillInfo);
      itemKill.addItemKill(this.itemKillInfo).then((response) => {
          if(response.code==200){
            this.$message({
            message: "添加成功",
            type: "success",
            });
            this.$router.push("/itemKill/list");
          }else{
              this.$message({
            message: "添加失败",
            type: "error",
            });
          }
        
      });
      //this.$router.push("/itemKill/list");
      //创建缓存
      
    },
    getItemKill(id) {
      itemKill.getItemKill(id).then((response) => {
          console.log(response.data)
        this.itemKillInfo = response.data.itemKill;
      });
    },
    updateItemKill() {
      itemKill.updateItemKill(this.itemKillInfo).then((response) => {
        if(response.code==200){
            this.$message({
            message: "更新成功",
            type: "success",
            });
            this.$router.push("/itemKill/list");
        }else{
            this.$message({
            message: "更新失败",
            type: "error",
            });
        }
      });
    },
    getItems(){
        item.getItems().then(response=>{
            this.items=response.data.items;
        })
    },
    getChoose(value){
        console.log(value)
        this.itemKillInfo.itemId=value
    }
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {
    console.log(this.$route.params.id);
    //获取商品列表
    this.getItems()
    //获取路由id值
    if (this.$route.params && this.$route.params.id) {
      // //判断是添加还是编辑
      this.itemKillId = this.$route.params.id;
      // //调用根据id查询课程的方法
      this.getItemKill(this.itemKillId);
    } else {
      console.log("啥都不做");
    }
  },
};
</script>
<style lang='scss' scoped>
//@import url(); 引入公共css类
.Center{
    margin: 0 auto;
    margin-top: 20px;
    text-align: center;
    width: 50%;
}
</style>